	<template>
		<view class="wanl-signin">
			<view class="edgeInsetTop"> </view>
			<!-- header头部 -->
			<view class="header">
				<image src="../../../static/images/user/bg.png" style="position: absolute;  width: 100%;top: -17vw;"
					mode="widthFix"></image>
				<view class="user" style="position: relative;top: -10vw; margin-left: 8vw;">
					<!-- <view class="cu-avatar lg round" :style="{ backgroundImage: 'url(' + $wanlshop.oss(user.avatar, 52, 52, 2, 'avatar') + ')' }"></view>
				 -->
					<image style="width: 7.46vw;height: 7.46vw;" src="../../../static/images/user/jinbi.png" mode="">
					</image>
					<view style="margin-left:6rpx">
						<view class="text-sm" style="margin-top: 6vw;">
							<!-- <text class="margin-right">Lv{{user.level}}</text> -->
							<text style="font-size: 8vw;"> {{user.score}} </text>
						</view>
						<view @tap="$wanlshop.auth('/pages/user/signin/log')">可用积分></view>
					</view>

					<!-- <view style="position: relative; left: -12vw;top: 10vw; font-weight: normal; font-size: 3.2vw; "
						@tap="onScore">
						<text>可用积分></text>
					</view> -->
				</view>
				<view style="font-weight: normal; font-size: 3.2vw; " @tap="onScore">
					<text>可用积分></text>
				</view>

				<view class="text-center" style="position: absolute;top: 28.06vw; left: 8vw; ">
					<view v-if="signinData.signin"><button
							style="width: 27.2vw;height: 8vw;font-size: 3.46vw;display: flex;align-items: center;justify-content: center; color: white;background-color: #fd8c00;border-radius:100vw;">已签到</button>
					</view>
					<view v-else><button
							style="width: 27.2vw;height: 8vw;font-size: 3.46vw;display: flex;align-items: center;justify-content: center; color: white;background-color: #fd8c00;border-radius:100vw;"
							@tap="attendanceUpdate()">立即签到</button></view>
				</view>
			</view>
			<!-- 签到表 -->
			<view class="qiandao content bg-white padding-tb-bj radius-bock shadow-warp" style="margin-top: 0vw;">
				<view class="text-df margin-tb-xs margin-lr-bj text-bold" style="color: #5A5B5C;">
					<view v-if="signinData.signin" style="display: flex;flex-direction: column;">

						<text style="font-size: 4.266vw; margin: 0 0 2vw 0; ">已经连签{{ signinData.successions }}天</text>

						<text
							style="font-size: 3.46vw; color: #9C9C9C;font-weight: normal; ">再连续签到{{ 7-signinData.successions }}天，可获得双倍积分</text>

					</view>
					<view v-else>
						今天签到可获得
						<text>{{ signinData.score }}</text>
						积分
					</view>
				</view>

				<view class="box w100P flex justify-between" style="padding: 0 20rpx;">
					<view v-for="(item,index) in timeList" :key="index">
						<view class="item" :class="{activeDay: siginDates.includes(item.time)}">
							<uni-icons type="checkmarkempty" size="22" color="#fff"
								v-if="siginDates.includes(item.time)"></uni-icons>
							<view class="" v-else>
								<text style="color: #999;" v-if="compareDate(item.date)">已过</text>
								<view style="position: relative;" v-else>
									<image src="../../../static/images/user/jinbi.png" style="width: 36rpx;height: 36rpx;">
									</image>
									<view style="font-size: 24rpx;">
										{{stepsOption[index].desc}}
									</view>
								</view>
							</view>
						</view>
						<view class="date">{{ item.time }}</view>
					</view>
				</view>
			</view>
			<!-- 每日任务 -->
			<view style="width: 94.66vw;max-height: 80.53vw;overflow-y: auto;
				border-radius: 3.2vw;box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.05);
				background-color: white;margin-left: 2.66vw;position: relative;">
				<view class="title" style="font-size: 4.26vw;font-weight: bold;
				position: relative; top: 3.4vw;  margin: 0vw 0 3.46vw 4vw; ">每日任务</view>
				<!-- <image src="../../../static/images/user/task礼物.png" mode=""></image> -->
				<view class="rqi" style="padding-top: 3.4vw;padding-bottom: 5vw;">
					<view class="list" style="width: 85.6vw; height: 19.2vw; position: relative;
				 display: flex;align-items:center;justify-content: space-between;
				 background-color: #F1FFF6;border-radius: 3.2vw;margin-top: 2.6vw;background: #f6efe9;
				 margin-left: 4.8vw;margin:0 auto 2vw auto;
				 " v-for="(item,i) in taskList" :key="item.id">
						<view class="left" style="display: flex; align-items: center;">
							<image style=" margin: 0 4.7vw; width: 5.86vw;height: 5.33vw;"
								src="../../../static/images/user/task_icon.png" mode="aspectFit"></image>
							<view class="imation" style="display: flex;flex-direction: column; text-align: left; ">
								<text
									style="font-size: 26rpx;font-weight: bold;">{{item.name}}({{item.done_num}}/{{item.max_num}})
								</text>

								<view class="points-box">
									<text style="font-size: 2.93vw;color: #9C9C9C;">{{item.desc}}</text>
									<image src="../../../static/images/user/jinbi.png" mode="widthFix"></image>
									<text class="point">+{{item.points}}积分</text>
								</view>
							</view>
						</view>
						<!-- product/list -->
						<view class="btn" @tap="toTask(item.name)">
							<button :disabled="item.done_num >= item.max_num"
								:class="item.done_num >= item.max_num ? 'disabled' : ''" style="
									position: absolute;
									right: 4vw;
									top: 6.13vw;
									width:16.53vw;
									height: 7.2vw;
									border-radius: 273.33vw;
									opacity: 1;
									color: #fff;
									font-size: 3vw;
									background: #fd8c00;
									display: flex;
									align-items: center;
									justify-content: center;
									white-space: nowrap;
								">
								{{item.done_num >= item.max_num ? '已完成' : '去完成'}}
							</button>
						</view>
					</view>
				</view>
			</view>
			<view class="fixed-box">
				<!-- 客服小组件 -->
				<view @tap="$wanlshop.auth('/pages/user/service')">
					<view class="kefu-img" :style="{ background: `url(${$wanlshop.oss(common.appStyle.im_icon)})` }"
						style="width: 90rpx; height: 90rpx; background-size: cover!important;"></view>
				</view>
			</view>
			<!-- 广告 -->
			<view @tap="toActivity()">
				<image style="width: 708rpx;height: 224rpx;margin-top: 3vw;margin-bottom:3vw; margin-left: 2.66vw; "
					:src="$wanlshop.oss(activeImage)" mode="" />
			</view>
			<!-- 积分兑换 -->
			<!-- <image src="../../../static/images/user/bgimg.png" mode=""></image> -->
			<view class="interg" style="
			border-radius: 3.2vw;
			padding-bottom: 12.2vw;
			margin-bottom: 3vw;
			width: 94.66vw;margin: 0 auto;
			box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.05);
			">
				<text style="display: block;margin: 0 0 5vw 3vw; font-size: 4.266vw;font-weight: bold;">积分兑换</text>
				<view class="nr" style="display: flex; flex-wrap: wrap;justify-content: space-evenly;  ">
					<view style="position: relative;box-shadow: 0px 0px 2.74px 0px #ccc;margin: 10rpx;" class="card"
						v-for="(item,i) in interg " @tap="SubmitData(item)">
						<image style="width: 100%; height: 41.68vw;" :src="`http://shangya.gzzhenyi.net${item.image}`"
							mode="aspectFill">
						</image>
						<view class="tp" style="position: absolute;top: 1vw;left: 1vw;">
							<image style="border-radius: 1vw 0; width: 16vw; height: 5.06vw; "
								src="../../../static/images/user/xiangou.png" mode=""></image>
							<text
								style="font-size: 2.8vw; position: absolute;top: 0.5vw;left: 2vw; color: #F7AF4D;">限购{{item.allow_exchange}}次</text>
						</view>
						<view class="nr" style="margin: 0 1vw; width: 42.59vw; ">
							<text id="text"
								style="font-size: 3.55vw;font-weight: 500; margin: 1vw; width: 42.59vw;">{{item.title}}</text>
							<view class="bottom" style="display: flex;justify-content: space-between;">
								<view class="left" style="display: flex;align-items: center;">
									<image style="width: 4.8vw;height: 7.73vw;" src="../../../static/images/user/jinbi.png"
										mode="widthFix"></image>
									<text
										style="display: block;margin: 0 1vw; padding-bottom: 1vw; font-size: 4.26vw; color: #F7AF4D;font-weight: bold;">{{item.points}}</text>
								</view>
								<view class="right" style="margin: 1vw 3vw;">
									<text
										style="font-size: 2.44vw; color: #B5B5B5; ">{{item.exchange_quantity== null ? 0 : item.exchange_quantity}}人已兑换</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>

			<!-- <view class="edgeInsetBottom"></view> -->
			<wanl-modal custom :show="attendanceModalVisible">
				<view class="attendance-modal">
					<view class="modal-header">
						<image :src="$wanlshop.appstc('/common/cup.png')" mode="widthFix"></image>
					</view>
					<view class="modal-content text-sm wanl-gray">
						<view>{{ signinInfo }}</view>
					</view>
					<view class="modal-btn"><button class="cu-btn wanl-bg-redorange round lg text-sm"
							@tap="attendanceModalVisible = false">我知道了</button></view>
				</view>
			</wanl-modal>


		</view>
	</template>

	<script>
		import UniPopup from "@/uni_modules/uni-popup/components/uni-popup-dialog/uni-popup-dialog.vue";
		import {
			mapState
		} from 'vuex';
		export default {


			data() {
				return {
					//产品数据
					goodsData: {
						desc: '·35%高易消化蛋白 ·0诱食剂 ·65%深海鱼肉添加', // 描述
						service_id: null, // 服务
						id: 0,
						category_id: 0,
						shop_id: 0,
						brand_id: 0,
						freight_id: 0,
						title: '',
						image: '',
						images: '',
						flag: '',
						content: '',
						category_attribute: [],
						activity_type: 'goods',
						price: null,
						interval_price: null,
						market_price: null,
						sales: 0,
						brand: {},
						freight: {
							name: '',
							isdelivery: 1
						},
						payment: 0,
						comment: 0,
						praise: 0,
						moderate: 0,
						negative: 0,
						like: 0,
						views: 0,
						status: '',
						category: {},
						follow: true,
						sku: [],
						spu: [],
						promotion: [],
						coupon: [],
						comment_list: {
							data: [],
							figure: 0,
							tag: []
						},
						shop: {
							find_user: {
								fans: 0
							},
							city: ''
						},
						shop_recommend: {}
					},
					//判断任务是否完成


					interg: [], // 积分兑换
					api: '',
					taskList: [], // 任务列表
					selectNum: 1, //选中数量
					service: null, // 服务
					selectshop: {}, //存放最后选中的商品
					isChoice: '', // 是否从选择进入
					modalName: null, // 弹出层
					signinData: {},
					selected: [],
					signinInfo: '',
					attendanceModalVisible: false,
					newWeek: [],
					stepsOption: [{
							title: '周一',
							desc: '+2'
						},
						{
							title: '周二',
							desc: '+4'
						},
						{
							title: '周三',
							desc: '+6'
						},
						{
							title: '周四',
							desc: '+8'
						},
						{
							title: '周五',
							desc: '+10'
						},
						{
							title: '周六',
							desc: '+12'
						},
						{
							title: '周日',
							desc: '+14'
						},
					],
					timeList: [],
					siginDates: [],
					activeImage: ''
				};
			},
			onShow() {
				this.taskLists();
			},
			onLoad(option) {
				this.loadMany();
				this.loadData();
				const dates = this.getCurrentWeek();

				const resTime = []
				for (let i = 0; i < 7; i++) {
					resTime.push({
						check: true,
						time: this.timestampToYMD(dates[i]),
						date: dates[i]
					})
				}
				this.timeList = resTime

				console.log(resTime, 'resTime')
			},
			computed: {
				canCount() {
					return this.subIndex?.some(item => item === -1);
				},
				// ...mapState(['cart', 'common'])
				...mapState(['user', 'cart', 'common'])
			},
			methods: {
				timestampToYMD(timestamp) {
					var date = new Date(timestamp);
					var year = date.getFullYear();
					var month = date.getMonth() + 1;
					var day = date.getDate();
					return month + "." + day;
				},
				getCurrentWeek() {
					const now = new Date();
					const dayOfWeek = now.getDay(); // 0 表示周日，1 到 6 表示周一到周六
					const daysToSubtract = dayOfWeek !== 0 ? dayOfWeek - 1 : 6;

					const startDate = new Date(now);
					startDate.setDate(startDate.getDate() - daysToSubtract);

					const dates = [];
					for (let i = 0; i < 7; i++) {
						const date = new Date(startDate);
						date.setDate(date.getDate() + i);
						dates.push(new Date(date))

						console.log(new Date(date), '时间错的')
					}
					return dates;
				},
				toTask(text) {
					if (text == "下单任意商品") {
						uni.navigateTo({
							url: "/pages/product/list"
						})
					} else if (text == "评价商品") {
						uni.navigateTo({
							url: "/pages/user/order/order?state=4"
						})
					}
				},



				// 跳转活动页面
				toActivity() {
					this.$api.post({
						loadingTip: '加载中',
						url: `/wanlshop/activity/detail`,
						data: {
							type: 'signin',
						},
						success: result => {
							uni.navigateTo({
								url: `/pages/page/activityPage`,
								success: (res) => {
									res.eventChannel.emit('data', {
										activity: result?.title,
										productList: result?.categories,
										headerImage: result?.header_img,
										footerImage: result?.footer_img,
									})
								}
							})
						}
					})
				},

				// 获取每日任务列表
				async taskLists() {
					this.$api.get({
							url: '/wanlshop/task/list',
							success: res => {
								console.log(res)
								this.taskList = res.list

							}
						}
					)
				},
				async loadMany() {
					this.$api.post({
						url: '/wanlshop/product/points',
						success: res => {
							this.interg = res
						}
					})
				},
				messageToggle(type) {
					this.$refs.message.open()
				},
				async loadData() {
					this.$api.get({
						url: '/wanlshop/signin/getSignin',
						success: res => {
							this.signinData = res;
							console.log(this.signinData)
							// 进程
							this.stepsOption[0].desc = '+' + res.signinscore.s1;
							this.stepsOption[1].desc = '+' + res.signinscore.s2;
							this.stepsOption[2].desc = '+' + res.signinscore.s3;
							this.stepsOption[3].desc = '+' + res.signinscore.s4;
							this.stepsOption[4].desc = '+' + res.signinscore.s5;
							this.stepsOption[5].desc = '+' + res.signinscore.s6;
							this.stepsOption[6].desc = '+' + res.signinscore.sn;


							// this.stepsOption[7].desc = '+' + res.signinscore.sn;
							// 打标
							res.list.forEach(item => {
								this.selected.push({
									date: this.timestampToTime(item.createtime),
									info: '已签'
								});
								this.siginDates.push(this.timestampToYMD(this.timestampToTime(item
									.createtime)))
							});
							this.$store.commit('user/setUserInfo', {
								score: res.user_score
							});
							if (this.signinData.successions == 0 || this.signinData.successions == 7) {
								const date = new Date();
								const day = date.getDay()
								// // 转换为具体的星期名称

								// console.log(day)
								let weekDay = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
								this.newWeek = [...weekDay.slice(day, 7), ...weekDay.slice(0, day)]
								uni.setStorage({
									key: "weekDay",
									data: {
										week: this.newWeek
									}
								})
							} else {
								let week = uni.getStorage({
									key: "weekDay"
								})
								this.newWeek = week
							}

							this.$api.post({
								loadingTip: '加载中',
								url: `/wanlshop/product/hotsale?page=1`,
								success: res => {
									res.data.forEach(item => {
										if (item.row == "签到活动") {
											this.activeImage = item.img_url;
										}
									})
								}
							})
						}
					});
				},

				// 提交数据
				SubmitData(item) {

					// console.log(item)
					this.isChoice = item;
					this.ProcessingData(item);


				},
				ProcessingData(item) {
					if (this.isChoice == item) {
						// console.log("3")
						let goodsData = [{
							goods_id: item.goods_id,
							number: item.allow_exchange,
							sku_id: item.id,
							points: item.points,
							store_id: this.service?.id
						}];
						console.log(goodsData)
						// 提交订单
						if (this.$store.state.user.isLogin) {
							console.log(this.$store.state.user.score, item.points)
							if (this.$store.state.user.score >= item.points) {
								uni.redirectTo({
									url: `/pages/user/order/addorder?order_type=groups&data=${JSON.stringify(goodsData)}`
								});
							} else {
								uni.showToast({
									title: "积分不足，无法兑换",

									duration: 2000,
									icon: "none"
								})
							}

						} else {
							this.$wanlshop.to('/pages/user/auth/name');
						}

					} else {
						this.$wanlshop.msg('数据异常');
					}

				},
				isSameDay(a, b) {
					// const timestamp1 = Math.floor(1624190400000/(24*60*60*1000)); // 2021-07-19 00:00:00 UTC
					// const timestamp2 = Math.floor(1624276800000/(24*60*60*1000)); // 2021-07-19 23:59:59 UTC
					// let res = this.isSameDay(timestamp1,timestamp2);

					return Math.floor(a / (24 * 60 * 60 * 1000)) === Math.floor(b / (24 * 60 * 60 * 1000))
				},
				// // 点击签到
				attendanceUpdate() {
					// this.timeList

					this.$api.post({
						url: '/wanlshop/signin/dosign',
						success: res => {
							this.loadData();
							if (this.signinData.signin) {
								this.signinInfo = '已经连续签到' + this.signinData.successions + '天/n明日继续签到可获得' + this
									.signinData.score + '积分';
							} else {
								console.log(this.signinData)
								this.signinInfo = '赠送的' + this.signinData.score + '积分已发到您的账户中';
							}
							this.attendanceModalVisible = true;
						}
					});
				},
				timestampToTime(timestamp) {
					var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
					var Y = date.getFullYear() + '-';
					var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
					var D = date.getDate();
					return Y + M + D;
				},
				compareDate(time) {
					const date1 = new Date();
					const date2 = new Date(time);
					return date1 > date2 && date1.getDate() != date2.getDate();
				},
				onScore() {
					this.$wanlshop.to('/pages/user/signin/log');
				}
			}
		};
	</script>

	<style scoped lang="scss">
		.wanl-signin {
			background: #f6efe9;
		}

		#text {
			overflow: hidden;
			text-overflow: ellipsis;
			display: -webkit-box;
			-webkit-line-clamp: 1;
			-webkit-box-orient: vertical;
		}

		.wanl-signin .header {
			display: flex;
			height: 320rpx;
		}

		.wanl-signin .header .user {
			display: flex;
			align-items: center;
		}

		.wanl-signin .header .tag {
			background-color: #fff;
			padding: 10rpx 10rpx;
			border-radius: 100rpx 0 0 100rpx;
		}

		.wanl-signin .content {
			margin: 25rpx;
			margin-top: -80rpx;
		}

		.wanl-signin .content .cu-btn {
			width: 50%;
		}

		.wanl-signin .attendance-modal .modal-header {
			width: 100%;
			height: 260rpx;
			margin-top: -180rpx;
			position: relative;
		}

		.wanl-signin .attendance-modal .modal-header image {
			width: 100%;
			height: 100%;
		}

		.wanl-signin .attendance-modal .modal-content {
			height: 200rpx;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.wanl-signin .attendance-modal .modal-btn {
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.wanl-signin .attendance-modal .btn {
			width: 100%;
			border-radius: 50rem;
		}

		.btn .disabled {
			background: #999 !important;
		}

		.fixed-box {
			position: fixed;
			right: 50rpx;
			z-index: 999;

			bottom: 220rpx;

			/* #ifdef MP */
			bottom: 140rpx;
			/* #endif */

			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			gap: 20rpx;
		}

		.kefu-img {
			background-size: cover !important;
		}

		.activeDay {
			display: flex;
			justify-content: center;
			align-items: center;
			background: rgb(253, 118, 1) !important;
		}

		.qiandao {
			.box {
				.item {
					width: 80rpx;
					height: 100rpx;
					border-radius: 20rpx;
					background: #f6efe9;
					display: flex;
					flex-direction: column;
					align-items: center;
					justify-content: center;
					margin-bottom: 10rpx;
				}

				.date {
					text-align: center;
					color: $font-color-dark;
				}
			}
		}

		.rqi {
			.imation .points-box {
				display: flex;
				align-items: center;
				margin-top: 8rpx;

				image {
					width: 30rpx;
					height: 30rpx;
					margin-left: 20rpx;
				}

				.point {
					color: $font-color-dark;
					font-size: 26rpx;
				}
			}
		}
	</style>